// 引入 vuex
import Vue from 'vue'
import Vuex from 'vuex'
// 注册
Vue.use(Vuex)
// 实例化仓库
export default new Vuex.Store({
  // 严格模式
  strict: true,
  // 这里是创建仓库时的配置对象
  state: {
    // 定义公共状态数据
    name: 'tom',
    count: 0,
    list: [1,2,3,4,5,6,7,8,9,10,666,888,999],
    student: {
      name: 'tom',
      school: {
        name: '吉山幼儿园',
        address: {
          city: '广州',
          street: '珠吉路',
          detail: '天河区珠吉路58号'
        }
      }
    }
  },
  mutations: {
    setCount(state, data) {
      // 第一个参数默认是 state 本身
      // 第二个参数则是调用时传入的数据(可选)
      state.count += data
    }
  },
  actions: {
    asyncSetCount(store, data) {
      // 故意演示演示异步操作
      setTimeout(() => {
        // 不能自己修改 state 需要调用 mutations
        store.commit('setCount', data)
      }, 1000);
    }
  },
  getters: {
    // 派生状态
    // 假设目标是显示list中大于五的数据
    filterList: state => state.list.filter(item=>item>5),
    schoolAddr: state => state.student.school.address.detail
  }
})